

const { createApp, ref, onMounted } = Vue


createApp({
    setup() {
        const message = ref('Hello vue!')
        //存放部门数据
        const deptList = ref([])

        // 目前编辑窗口中的部门编号
        const curDeptId = ref('0000')
        // 目前编辑窗口中的部门名称
        const curDeptName = ref('武汉职业技术学院')
        // 目前编辑窗口中的部门地址
        const curDeptLocation = ref('创业大道')


        const getData = () => {
            axios.get('http://127.0.0.1:3001/api/getAllDept', {})
            .then(
                (responseData) => {
                    if (responseData.data.status == 200) {
                        deptList.value = responseData.data.data;
                        console.log(deptList.value)


                    }
                }
            )
        }

        onMounted(() => {
            getData()
        })

        //编辑
        const edit = (deptId) => {
            //  alert(deptId)
            console.log(deptId)
            curDeptId.value = deptId
            // 通过DeptId查部门信息给curDeptId，curDeptName，curDeptLocation

            //api/getDeptById
            axios.post('http://127.0.0.1:3001/api/getDeptById', { "deptId": deptId })
                .then(
                    responseData => {
                        console.log(responseData)
                        curDeptName.value = responseData.data.data.deptName
                        curDeptLocation.value = responseData.data.data.deptLocation
                    }
                )
        }



        // 删除数据
        const del = (deptId) => {
            var isDel = confirm('确认删除？');
            // 选确认返回 true选取消返回 false
            if (isDel) {
                axios.get('http://127.0.0.1:3001/api/delDept', {
                    params: { deptId: deptId }
                })
                    .then(responseData => {
                        console.log(responseData)
                        if (responseData.data.status == 200) {

                        } else {
                            alert(`删除失败 ${responseData.data.message}`)
                        }
                    })
            }
            alert(deptId)
        }

        // 保存数据
        const save = () => {
            // 调用接口保存数据 /api/updateDeptById
            axios.post('http://127.0.0.1:3001/api/updateDeptById', {
                deptId: curDeptId.value,
                deptName: curDeptName.value
            })
                .then(responseData => {
                    console.log(responseData.data)
                    alert(responseData.data.message)
                    getData()
                })
        
        }

        return {
            message,
            deptList,
            edit,
            del,
            save,
            curDeptId,
            curDeptLocation,
            curDeptName
        }


        // 获取部门数据
        // 借用生命周期函数的钩子调用


    }
}).mount('#app')

